/*
Theme Name: IdeaHead
Author: Eggplant Studios
Description: IdeaHead Theme, Summer 2012
Version: 1.0
*/

/*----------------------------------------------------------------------------------------------------*/
/*----------------------------------------------- FONTS ----------------------------------------------*/
/*----------------------------------------------------------------------------------------------------*/
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,700,300);

.font, nav li a, 
h1,h2,h3,h4,h5,h6 
{ font-family: 'Open Sans', sans-serif; }

h1,h2,h3,h4,h5,h5 { 
    font-weight: normal;
    margin: 0px;
    margin-bottom: 6px;
    }
    h1.big { font-size: 72px; }
    h1.section-title { font-size: 14px; }
    h1 { font-size: 30px; }
    h2 { font-size: 22px; }
    h3 { font-size: 20px; }
    h4 { font-size: 18px; }
    h5 { font-size: 16px; }
    h6 { font-size: 16px; }


/*----------------------------------------------------------------------------------------------------*/
/*------------------------------------------------ RESET  --------------------------------------------*/
/*----------------------------------------------------------------------------------------------------*/
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio[controls], canvas, video { display: inline-block; *display: inline; *zoom: 1; }

html { font-size: 100%; overflow-y: scroll; -webkit-overflow-scrolling: touch; -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body { overflow: hidden; margin: 0; font-size: 13px; line-height: 1.231; }
body, button, input, select, textarea { font-family: sans-serif; color: #222222; }

::-moz-selection { backgrounfd: #fe57a1; color: #ffffff; text-shadow: none; }
::selection { background: #fe57a1; color: #ffffff; text-shadow: none; }


abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px dotted #dddddd; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000000; text-decoration: none; }
mark { background: #ff0; color: #000000; font-style: italic; font-weight: bold; }

pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }

q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }

ul, ol { margin: 0 0; padding: 0 0 0 0; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; margin: 0; padding: 0; }
#sidebar ul, #sidebar ol { list-style: none; margin: 0; padding: 0; }

img { border: 0; -ms-interpolation-mode: bicubic; }

svg:not(:root) {
    overflow: hidden;
}

figure { margin: 0; }

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
legend { border: 0; *margin-left: -7px; padding: 0; }
label { cursor: pointer; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; *overflow: visible; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
input[type="search"] { -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; }
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { }
table { border-collapse: collapse; border-spacing: 0; }
form p, form label { font-size: 12px; color: #888888; margin: 0px;   }
label { display: inline-block; }
table th { text-align: left; }



/*----------------------------------------------------------------------------------------------------*/
/*------------------------------------------ EPS GLOBAL STYLES  --------------------------------------*/
/*----------------------------------------------------------------------------------------------------*/


.color, .colour { color: #f37f00; }

.inline { display: inline; }
.block { display: block; }

.relative { position: relative; }

.no-margin { margin: 0px !important; }

.margin-top-less { margin-top: 8px; }
.margin-top-lots { margin-top: 32px; }
.margin-top-ultra { margin-top: 128px; }
.margin-top { margin-top: 16px; }

.margin-bottom-less { margin-bottom: 8px; }
.margin-bottom { margin-bottom: 16px; }
.margin-bottom-lots { margin-bottom: 32px; }

.margin-sides-less { margin: 0px 8px; }
.margin-sides { margin: 0px 16px; }
.margin-sides-lots { margin: 0px 32px; }

.margin-vertical { margin-top: 16px; margin-bottom: 16px; }

.margin-less { margin: 6px; }
.margin { margin: 16px; }
.margin-lots { margin: 32px; }

.padding-less { padding: 6px;  }
.padding { padding: 16px;  }
.padding-lots { padding: 32px;  }
.padding-xlots { padding: 64px; }

.padding-sides-less { padding: 0px 6px; }
.padding-sides { padding: 0px 16px; }
.padding-sides-lots { padding: 0px 32px; }
.padding-sides-xlots { padding: 0px 64px; }


.padding-vertical { padding: 16px 0px; }

.padding-top-less { padding-top: 6px; }
.padding-top { padding-top: 16px; }
.padding-top-lots { padding-top: 32px !important; }


.serif { font-family: Georgia, serif; }

.strong { font-weight: bold; }

.half-width { width: 50% !important; }

.copyright { font-size: 11px; color: #aaaaaa; }
.copyright a:link, .copyright a:visited, .copyright a { color: white; text-decoration: none; }

.col2 { }
    .col2 > .col { width: 50%; float: left; }
    .col2 > .colspan2 { width: 100%; }
.col3 { }
    .col3 > .col, .col3-widgets > .widget { width: 33%; float: left; }
    .col3 > .colspan2 { width: 66%; }
    .col3 > .colspan3 { width: 100%; }
    
.col4 { }
    .col4 > .col { width: 25%; float: left; }
    .col4 > .colspan2 { width: 50%; }
    .col4 > .colspan3 { width: 75%; }
.col5 { }
    .col5 > .col { width: 20%; float: left; }
    .col5 > .colspan2 { width: 40%; }
    .col5 > .colspan3 { width: 60%; }
    .col5 > .colspan4 { width: 80%; }
    
.col6 { }
    .col6 > .col { width: 16.66%; float: left; }
    .col6 > .colspan2 { width: 33.33%; }
    .col6 > .colspan3 { width: 50%; }
    .col6 > .colspan4 { width: 66.66%; }
    .col6 > .colspan5 { width: 83.33%; }  
     
.col7 { }
    .col7 > .col { width: 14.28%; float: left; }
    .col7 > .colspan2 { width: 28.57%; }
    .col7 > .colspan3 { width: 42.85%; }
    .col7 > .colspan4 { width: 54.14%; }
    .col7 > .colspan5 { width: 71.42%; } 
    .col7 > .colspan6 { width: 83.33%; }  
    
.big { font-size: 120%; }
.ultra { font-size: 200%; line-height: 140%; }
.clear { clear: both; }
.left, .alignleft { display: block; float: left !important; }
.right, .alignright {display: block; float: right !important; }
.text-left { text-align: left; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.align-center { display: block; margin: 0 auto; }
.align-top { vertical-align: top; }
.inline-block { display: inline-block; }
.block { display: block; }
.grey { color: #888888; }
.dark-grey { color: #444444 !important; }
.width-100 { width: 100%; }
.width-50 { width: 50%; }
.width-75 { width: 75%; }
.width-50.alignleft { width: 48%; margin-right: 2%; float: left; }
p:empty {display:none}
.width-400 { width: 400px; }
.width-250 { width: 250px; }
img.fancy { display: block; border: 4px solid white; margin: 12px 0px;
     -webkit-box-shadow: 1px 1px 6px rgba(0,0,0,0.2);
    -moz-box-shadow: 1px 1px 6px rgba(0,0,0,0.2);
    box-shadow: 1px 1px 6px rgba(0,0,0,0.2);
}
.mask, .fade { pointer-events: none; }

.credits { font-size: 11px; }
.glow {
    -webkit-box-shadow: 0px 0px 16px rgba(0,0,0,0.8);
    -moz-box-shadow: 0px 0px 16px rgba(0,0,0,0.8);
    box-shadow: 0px 0px 16px rgba(0,0,0,0.8);
}
.small-ds {
    -webkit-box-shadow: 1px 1px 6px rgba(0,0,0,0.2);
    -moz-box-shadow: 1px 1px 6px rgba(0,0,0,0.2);
    box-shadow: 1px 1px 6px rgba(0,0,0,0.2);
}

.rounded {
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    }
.rounded-small {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    }
.rounded-big {
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px;
    }

table.no-style { width: 100%; margin: 0; padding: 0; }
table.no-style tr {}
table.no-style td, table.no-style th { border: 1px solid #dddddd; }

.box-sizing {
        -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
}
.button-group {
    text-align: center;
}
    .button-group a {
        display: inline-block;
    }

/* =============================================================================
   Primary styles
   ========================================================================== */

.white-box, .table-frame {
    border: 1px solid #dddddd;
    background: white;
    background: rgba(255,255,255,0.90);
    padding: 16px;
    box-shadow: 1px 1px 16px rgba(46,90,3,0.50);
}
.table-frame { border-top: none; }
.white-trans {
    background: rgba(255,255,255,0.60);
}
.grey-box {
    border: 1px solid #eeeeee;
    border-radius: 6px;
    display: block;
    background: #fafafa;
}
.grey { 
    background-color: #cccccc; /* Old browsers */
   -webkit-transition: all 100ms;
}

a.grey:hover { 
    background-color: #eeeeee; /* Old browsers */
}
a { text-decoration: none; color: #222222; }




html {
  background: url('images/page-bg-07.jpg') no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}



    
    
.skin-gradient {
    background: #3b679e; /* Old browsers */
    text-shadow: -1px -1px 2px rgba(0,0,0,0.2);
}


.button.skin-gradient { padding: 0px; padding-bottom: 2px;}
#main-nav a.skin-gradient span,
.button.skin-gradient span {
    display: block;
    border-top: 2px solid #2b88d9;
    border-radius: 3px;
    
}
.button.skin-gradient span { padding: 0px 12px; }

input.skin-gradient,
#main-nav a.skin-gradient,
.button.skin-gradient {
    -webkit-transition: all 100ms;
}
input.skin-gradient:hover,
#main-nav a.skin-gradient:hover,
.button.skin-gradient:hover {
    background: #2b88d9; /* Old browsers */
    box-shadow: 1px 1px 6px rgba(0,0,0,0.5);
}
input.skin-gradient:active,
#main-nav a.skin-gradient:active,
.button.skin-gradient:active { background: #4d9fe7; }





.skin-gradient2 {
    background: #6b9320; /* Old browsers */
    background: -moz-linear-gradient(top,  #6b9320 29%, #456e08 98%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(29%,#6b9320), color-stop(98%,#456e08)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #6b9320 29%,#456e08 98%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #6b9320 29%,#456e08 98%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #6b9320 29%,#456e08 98%); /* IE10+ */
    background: linear-gradient(to bottom,  #6b9320 29%,#456e08 98%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6b9320', endColorstr='#456e08',GradientType=0 ); /* IE6-9 */
    text-shadow: 1px 1px 2px #207cca;

}
.skin-gradient2:visited {  }





#main > footer {
    text-align: center;
    color: #666666;
    font-size: 12px;
}

body article { margin-bottom: 32px; border-bottom: 1px dotted #eeeeee; }
body article ul { padding-left: 32px; }
.warnings { color: #770000; margin-top: 16px; font-style: italic;}
/**
 *     
 * 
 * 
 * 
 * 
 * 
 * WINDOW STYLES
 * 
 */


#window {
    width: 60%;
    margin: 64px auto;
    text-align: center;
}

#window form.login-form {
    text-align: left;
    padding: 5%;
    width: 90%;
    margin: 16px auto;
    display: block;
}


    #window form.login-form label {
        display: block;
        margin-bottom: 12px; 
        font-size: 120%; color: #222222;
        text-align: left;
    }
    
    #window form.login-form label span { display: inline-block; width: 16%; margin-bottom: 6px;}
    #window form.login-form input[type='text'], form.login-form #window input[type='email'], #window form.login-form input[type='password']  {
        border-radius: 4px; border: 1px solid #aaaaaa;
        width: 95%;
        padding: 8px 2.5%;
        display: inline-block;
        font-weight: 100;
        font-size: 120%;
        color: #222222;
    }



/**
 *     
 * 
 * 
 * 
 * 
 * 
 * MESSAGES
 * 
 */


#message-list { 
    padding: 6px 12px;
    background: #FFFFCC; 
    border-radius: 4px; 
    box-shadow: 1px 1px 12px rgba(249,174,24,0.2);
    border: 1px solid rgba(249,174,24,0.5);
    display: block;
}
    #message-list > li {
        display: block;
        padding: 6px 0;
        padding-left: 28px;
        min-height: 20px;
        background: url('ui/comment-2-20.png') center left no-repeat;
        font-size: 13px; line-height: 20px;
        border-bottom: 1px dotted rgba(249,174,24,0.2);
    }
    #message-list > li:last-child {
        border-bottom: none;
    }
    
    
    

/**
 *     
 * 
 * 
 * 
 * 
 * 
 * SUBSCRIPTION DETAILS 
 * 
 */
    
       
#subscription-summary {
    border: 1px solid #eeeeee;
    background: white;
    padding: 16px;
    margin-bottom: 12px;
    min-width: 830px; 
}
#subscription-summary.active        { background: url('ui/active-bg.png');   border: 5px solid #e4f4d7; }
#subscription-summary.inactive      { background: url('ui/inactive-bg.png'); border: 5px solid #fedcdc; }
#subscription-summary.expiring      { background: url('ui/expiring-bg.png'); border: 5px solid #ffe6c3; }
#subscription-summary.paused,
#subscription-summary.future        { background: url('ui/paused-bg.png');   border: 5px solid #fdf2cb; }

#subscription-summary h1            { font-size: 24px; padding-left: 42px; height: 32px; line-height: 36px; text-shadow: 0px 0px 12px white; margin-bottom: 12px; }
#subscription-summary.active h1     { background: url('ui/active-32.png') left center no-repeat; }
#subscription-summary.paused h1,
#subscription-summary.future h1     { background: url('ui/pause-32.png') left center no-repeat; }
#subscription-summary.expiring h1   { background: url('ui/expiring-32.png') left center no-repeat; }
#subscription-summary.inactive  h1  { background: url('ui/inactive-32.png') left center no-repeat; }

#subscription-summary > div { width: 70%; }
#subscription-summary p { margin: 0; padding: 0; font-size: 110%; color: #666666; padding-top: 6px; margin-top: 6px; }



/**
 *     
 * 
 * 
 * 
 * 
 * 
 * Tooltips
 * 
 */


.tool-tip:before {
    position: absolute;
    border: 12px solid transparent;
    border-bottom: 12px solid rgba(249, 174, 24, 0.4);
    content: '';
    width: 0; height: 0;
    top: -28px; left: 24px;
}
.tool-tip {
    border: 4px solid rgba(249, 174, 24, 0.4);
    border-radius: 8px;
    padding: 0px;
    position: absolute;

}
.tool-tip p {
    background: rgba(255,255,255,0.85);
    color: #666666;
    border-radius: 4px;
    border: 1px solid #dddddd;
    margin: 0; padding: 12px;
    font-weight: 100; font-size: 12px; line-height: 18px;
}


/**
 *     
 * 
 * 
 * 
 * 
 * 
 * REPORT BUTTONS
 * 
 */


#report-buttons {
    margin: 24px 0; padding: 0;
    list-style: none;
    text-align: center;
    padding-bottom: 24px;
    border-bottom: 1px dotted #eeeeee;
}
    #report-buttons li {
        display: inline-block;
        width: 10%; min-width: 130px;
        font-size: 0; line-height: 0;
        vertical-align: top;
    }
    

    #report-buttons button[type=submit] {
        display: block;
        width: 95%;
        border: 1px solid #dddddd;
        box-shadow: inset 2px 2px 15px white, 1px 1px 4px #cccccc;
        border-radius: 6px;
        background: #fafafa url('ui/reports-40.png') center 12px  no-repeat;
        min-height: 130px;
        padding-top: 66px;
        margin: 6px;
        color: #F9AE18; 
        font-size: 14px; line-height: 18px;
        -webkit-transition: 300ms linear;
        text-shadow: 1px 1px 2px white;
   }
   #report-buttons button[type=submit].labels {
       background: #fafafa url('ui/labels-48.png') center 12px  no-repeat;
   }
   #report-buttons button[type=submit].subs {
       background: #fafafa url('ui/sub-40.png') center 12px  no-repeat;
   }
   #report-buttons button[type=submit].scrub {
       background: #fafafa url('ui/scrub-40.png') center 12px  no-repeat;
   }   
    #report-buttons button[type=submit]:hover {
        background-color: white;
        box-shadow: inset 2px 2px 15px white, 1px 1px 6px #aaaaaa;
    }
    


/**
 *     
 * 
 * 
 * 
 * 
 * 
 * FORMS
 * 
 */

.edit-form input[type='text'], .edit-form input[type='number'], .edit-form input[type='text'], .edit-form input[type='email'], .edit-form input[type='password'] { 
    width: 50%; }
    
.edit-form label { display: block; }
textarea { 
    border-radius: 4px; b
    order: 1px solid #aaaaaa;
    padding: 2px 6px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: inline-block;
    font-weight: 100;
    font-size: 90%;
    color: #222222;
    /*width: 50%; max-width: 50%; */
    }

input[type='text'], input[type='number'], input[type='text'], input[type='email'], input[type='password'] {
    border-radius: 4px; 
    border: 1px solid #aaaaaa;
    padding: 4px 6px;
    margin: 6px 0px;
    display: inline-block;
    font-weight: 100;
    font-size: 90%;
    color: #222222;
}
input.small { width: 32px; }
select { margin: 6px 0px; }
input[disabled] {
    background: #fafafa;
    border: 1px solid #cccccc;
    color: #aaaaaa;
}





label {
    display: inline-block;
    margin-bottom: 6px; 
    font-size: 90%; color: #222222;     
}
label span { display: inline-block; width: 22%; text-align: right; padding-right: 6px; }
label span.show-tool-tip { 
    display: inline-block; 
    text-align: left; 
    margin-left: 6px; 
    background: white;
    border: 1px solid #dddddd; 
    border-radius: 8px;
    text-align: center;
    width: 16px;
    padding:  4px;
    color: rgb(249, 174, 24);
    }




/**
 *     
 * 
 * 
 * 
 * 
 * 
 * SEARCH
 * 
 */

.searchform input, .searchform label { width: auto; }

.searchform .search-button {
    border: none;
    background: url('ui/search-20.png') left center no-repeat;
    width: 48px; height: 20px;
    padding-left: 24px;
    color: #4e750c;
    text-shadow: 1px 1px 1px white;
}
#advanced-search {
    padding: 12px;
    background: #fafafa;
    border: 1px solid #dddddd;
    display: none;
    font-size: 12px;
}

#advanced-search label { padding-left: 12px; }
#advanced-search label span { padding-right: 12px; }




    
/**
 *     
 * 
 * 
 * 
 * 
 * 
 * HEADER
 * 
 */




#publication-title {
    text-shadow: 1px 1px 1px #222222, -1px -1px 2px black;
    color: #eeeeee;
    font-size: 180%;
    margin: 0; padding: 0;
    line-height: 150%;
    margin-right: 24px;
}

#subscription-date-info {
    margin: 24px 0;
}
#subscription-week-title {
    background: url('ui/briefcase-64.png') left center no-repeat;
    padding-left: 72px;
    min-height: 64px; line-height: 64px;
    font-size: 24px;
}



/**
 *     
 * 
 * 
 * 
 * 
 * 
 * MISC TABLES
 * 
 */

a.toggle-allowance-controls, a.toggle-allowance-controls:link, a.toggle-allowance-controls:visited  {
    color: #222222 !important;
    font-size: 90%;
    text-shadow: 1px 1px 1px white;
    padding: 4px 6px; 
    background: #eeeeee;
    border: 1px solid #dddddd;
    border-radius: 4px;
    display: block;
    width: 50%;
    margin: 2px auto;
    text-align: center;
}

.user-add-allowance {
    margin: 16px 0;
    min-width: 600px;
    display: none;
}
.user-add-allowance ul {
    display: block;
    width: 25%; max-width: 120px;
    float: left;
    margin: 0; padding: 0;
    margin-right: 16px;
    background: #eeeeee;
    list-style: none;
}

.user-add-allowance li {
    display: block;
    border: 1px solid #dddddd;
    border-left: none;
}
.user-add-allowance li:first-child {
    border-top: none;
}
.user-add-allowance li:last-child {
    border-bottom: none;
}



.user-add-allowance li a, .user-add-allowance li a:link {
    display: block;
    width: auto;
    margin: 0;
    padding: 9px 16px;
    font-size: 13px;
    text-align: right;
    color: #333333;
    text-shadow: 1px 1px 1px white;
    
}
    .user-add-allowance li.active a {
        color: #333333;
        text-shadow: 1px 1px 1px white;
    }
    
    .user-add-allowance li.active { 
            border-right: none;
            background: white;
    }


    
.user-add-allowance-frame  {
    width: 70%;
    min-width: 450px;
}

#add-time, #pause-time, #remove-time, #end-time {
    padding: 12px;
    display: block;
}
#add-time label, #remove-time label, #end-time label {
    display: inline-block;
    padding: 6px; background: #fafafa; margin: 2px 4px;
}
#add-time input[type="radio"], #remove-time input[type="radio"] {
    margin-right: 4px; display: inline-block;
}

#pause-time, #remove-time, #end-time { display: none; }

.subscription-table .single-allowance-controls { display: none; padding: 8px; border: 1px solid #eeeeee; margin-top: 8px;  }
.subscription-table .single-allowance-controls input[type='number'] { 
    width: 94%; padding: 4px 3%;
}



/**
 *     
 * 
 * 
 * 
 * 
 * 
 * INSET TABLES
 * 
 */
.cell-light {
    border: 1px solid #dddddd;
    background: #fafafa;
    padding: 12px;
}

.shaded { 
    background: white !important;
    border: 1px solid #dddddd;
    vertical-align: top; }
    
.inset {
    border: 1px solid #eeeeee;
    background: white;
    border-radius: 6px;
    padding: 12px;
}

.inset-table {
    background: white;
    display: table;
    width: 100%;
}
.inset-table thead tr  { background: #3b679e; }
.inset-table tbody tr:nth-child(odd) { background: #fafafa; }
.inset-table .inset-table { font-size: 90%; }
.inset-table tr.active td { background: #FFFFCC !important; }



/**
 *     
 * 
 * 
 * 
 * 
 * 
 * PERCENT BAR
 * 
 */
.percent-bar {
    width: auto;
    height: 8px;
    background: #dddddd;
    border: 1px solid #222222;
    box-shadow: inset 0px 0px 4px #bbbbbb;
    border-radius: 3px;
    position: relative;
    overflow: hidden;
}
.percent-bar span {
    display: block;
    position: absolute; top: 0px; left: 0px;
    border-radius: 3px 0 0 3px;
    height: 8px;
    width: 50%;
    box-shadow: 1px 0px 2px #bbbbbb;
    text-indent: -999em;
}

    
.percent-bar span.percent_100 {
    background: #ed1c24;
    box-shadow: inset 0px 0px 4px #9e0b0f;
}

.percent-bar span.percent_90 {
    background: #f26522;
    box-shadow: inset 0px 0px 4px #a0410d;
}

.percent-bar span.percent_75 {
    background: #f7941d;
    box-shadow: inset 0px 0px 4px #a3620a;
}

.percent-bar span.percent_60 {
    background: #fff200;
    box-shadow: inset 0px 0px 4px #aba000;
}

.percent-bar span.percent_45 {
    background: #8dc63f;
    box-shadow: inset 0px 0px 4px #598527;
}

    .expiring .percent-bar {
        background: #fefeef;
        border: 1px solid #f26522;
        box-shadow: inset 0px 0px 4px #fefe51;
    }
    .expiring .percent-bar span {
    background: #ed1c24 url('ui/darkstripe-bg.png') top left repeat;
    box-shadow: inset 0px 0px 4px #9e0b0f;        
    }
    
    
    


/**
 *     
 * 
 * 
 * 
 * 
 * 
 * TABLES
 * 
 */
.subscription-table {
    display: table;
    width: 100%;
    font-size: 100%;
    color: #333333;
}

    .subscription-table .heading-row.skin-gradient label { color: white; }
    .subscription-table small { color: #aaaaaa; }
    .subscription-table .heading-row, 
    .subscription-table .dark-heading-row {
        width: auto; 
        text-align: left;
        color: white;
    }
    .subscription-table .heading-row a, 
    .subscription-table .dark-heading-row a
    .subscription-table .heading-row a:visited, 
    .subscription-table .dark-heading-row a:visited { color: white; }

    .subscription-table .dark-heading-row {
        background: #bbbbbb !important;
    }
    .subscription-table .dark-heading-row th { padding: 2px 6px;  text-shadow: 0px 0px 2px #999999; }


    .subscription-table th { padding: 6px 6px; }
    .subscription-table > tbody { border: 1px solid #aaaaaa; }
    .subscription-table td { padding:6px 6px; border: 1px solid #eeeeee; }
    .subscription-table > tbody > tr { 
        -webkit-transition: background 200ms; 
    }
    .subscription-table > tbody > tr:nth-child(odd) { background: white; }
    .subscription-table > tbody > tr:nth-child(even) { background: #f1f1f1; }
    #subscription-list.subscription-table > tbody > tr:hover { background: #FFFFCC; }
    
    .subscription-table td ul.search-display { padding-left: 26px; margin: 0px; }
    .subscription-table td ul.search-display li { margin-top: 3px; }
    
/**
 *     
 * 
 * 
 * 
 * 
 * 
 * PAGED NAV
 * 
 */
    
    
.subscription-table .paged-nav {
    text-align: left;
    color: #222222;
    background: white;
    border: none;
}
.subscription-table .paged-nav td {
    padding-top: 6px;
}

.subscription-table .paged-link:link, 
.subscription-table .paged-link:visited { 
    padding: 6px 8px; color: #222222; 
    font-size: 12px; 
    font-weight: 100; 
    margin-right: 4px; 
    border-radius: 2px;
    -webkit-transition: background 100ms;
    border: 1px solid #dddddd;
    }
.subscription-table .paged-link.default { background: #f4f4f4; }
.subscription-table .paged-link.default:hover { background: white; }

.subscription-table .paged-link.active { 
    border: 1px solid #222222; 
    color: white !important;
    }


.subscription-table .page-links { padding-left: 24px; }

    
/**
 *     
 * 
 * 
 * 
 * 
 * 
 * TABS AND NAV
 * 
 */
nav a { text-decoration: none; }
nav a:visited { color: inherit !important; }

#main-nav {
    background: #333333;
    border-bottom: 5px solid white;
    padding: 18px;
    box-shadow: 1px 1px 12px rgba(46,90,3,0.50);
}
    #main-nav a { 
        display: block;
        margin-right: 16px; 
        border-radius: 3px;
        width: auto !important;
        }
    #main-nav a span {
        display: block;
        font-size: 14px;
        line-height: 32px;
        height: 32px;
        padding: 0 12px;
        color: white;
        position: relative;
        padding-left: 42px;
    }
    
    #main-nav #loginout { 
        display: block;
        line-height: 32px;
        margin-right: 6px; 
        height: 32px;
        font-size: 14px;
        padding: 0px 12px; 
        text-shadow: 1px 1px 1px #dddddd;
        border-radius: 4px;
        color: #444444 !important;
        }
    #main-nav a.settings {
        width: 32px !important; height: 32px !important;
        background-color: #cccccc;
        background-image: url('ui/engine-26.png');
        background-position: center center;
        background-repeat: no-repeat;
        -webkit-transition: all 100ms;
    }
    #main-nav a.settings:hover {
        background-color: #eeeeee;
    }
    .large-menu-item { min-width: 400px; }    

#tabs { display: block; margin-bottom: 0px; }
#tabs ul li.active { background: rgba(255,255,255,0.95);  }
#tabs ul li { border-radius: 4px 4px 0px 0px; color: #444444; text-shadow: 1px 1px 1px white; display: inline-block; }



/**
 *     
 * 
 * 
 * 
 * 
 * 
 * BUTTONS
 * 
 */


.button {
    display: block;
    line-height: 32px;
    margin-right: 6px; 
    height: 32px;
    font-size: 14px;
    padding: 0px 12px; 
    color: white;
    text-shadow: 1px 1px 1px #aaaaaa;
    border-radius: 4px;
}

.primary-button {
    display: block;
    line-height: 32px;
    margin: 6px; 
    height: 32px;
    font-size: 14px;
    padding: 0px 24px; 
    color: white;
    text-shadow: 1px 1px 1px #aaaaaa;
    border-radius: 4px; 
    border: none;
}
.text-button {
    display: block;
    line-height: 32px;
    margin: 6px; 
    height: 32px;
    font-size: 12px;
    padding: 0px 12px; 
    color: #222222;
    text-shadow: 1px 1px 1px #dddddd;
    border-radius: 4px; 
    border: none;
}



/**
 *     
 * 
 * 
 * 
 * 
 * 
 * ICON BUTTONS
 * 
 */

.icon-button {
    display: block;
    line-height: 32px;
    margin-right: 6px; 
    height: 32px;
    font-size: 14px;
    padding: 0px 12px; padding-left: 56px;
    border-radius: 4px;
    color: #666666;
    position: relative;
    background: #eeeeee;/* Old browsers */
    background:    -moz-linear-gradient(top,  #eeeeee 0%, #cccccc 100%); /* FF3.6+ */
    background:    -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(100%,#cccccc)); /* Chrome,Safari4+ */
    background:    -webkit-linear-gradient(top,  #eeeeee 0%,#cccccc 100%); /* Chrome10+,Safari5.1+ */
    background:    -o-linear-gradient(top,  #eeeeee 0%,#cccccc 100%); /* Opera 11.10+ */
    background:    -ms-linear-gradient(top,  #eeeeee 0%,#cccccc 100%); /* IE10+ */
    background:  linear-gradient(to bottom,  #eeeeee 0%,#cccccc 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#cccccc',GradientType=0 ); /* IE6-9 */
}

.icon-button:before {
    width: 48px; height: 48px;
    display: block; content: '';
    position: absolute;
    top: -10px; left: 0;
}

.icon-button.newsub { padding-left: 36px; height: 26px; line-height: 26px; margin-top: 3px; }
.newsub:before {
    background: url('ui/new-sub-32.png') no-repeat; top: -3px; 
}

.viewsubs:before {
    width: 40px; height: 40px;
    display: block; content: '';
    position: absolute;
    top: -10px; left: 0;    
    background: url('ui/sub-40.png') no-repeat;
}

.viewusers:before {
    width: 40px; height: 40px;
    display: block; content: '';
    position: absolute;
    top: -10px; left: 0;    
    background: url('ui/users-40.png') no-repeat;
}
.viewreports:before {
    width: 40px; height: 40px;
    display: block; content: '';
    position: absolute;
    top: -10px; left: 0;    
    background: url('ui/reports-40.png') no-repeat;
}

.icon-button.export {padding-left: 36px; height: 26px; line-height: 26px; margin-top: 3px; }
.export:before {
    background: url('ui/export-32.png') no-repeat; top: -3px;
}

.icon-button.delete { padding-left: 36px; height: 26px; line-height: 26px; margin-top: 3px;}
.delete:before {
    background: url('ui/delete-32.png') no-repeat; top: -3px;
}




.accordion-item {
    background: none;
    -webkit-transition: background 200ms;
    -moz-transition: background 200ms;
    -o-transition: background 200ms;
    transition: background 200ms;    
    margin: 6px 0px;
    border: 1px solid transparent;
}

    .accordion-content p { margin-bottom: 14px;  }
    .accordion-item.active {  }

    .accordion-item .accordion-title { 
        font-size: 1.1em; font-weight: bold;
        line-height: 150%;
        cursor: pointer;
        background: #f4f4f4; color: #00769a;
        margin: 0; padding: 6px; 
        border-radius: 6px;
        box-shadow: inset 0px 12px 24px white;
        border: 1px solid #dddddd;
        text-shadow: 1px 1px 2px white;
    }
        .accordion-item .accordion-title:before {
            content: '\2193 ';
            font-size: 14px; line-height: 22px;
            width: 22px;
            height: 22px;
            margin-right: 6px;
            background: #fafafa;
            color: #aaaaaa;
            border: 1px solid #dddddd;
            display: inline-block;
            
            -webkit-border-radius: 11px;
            -moz-border-radius: 11px;
            -o-border-radius: 11px;
            border-radius: 11px;
            text-align: center;
            

        }
        .accordion-item.active .accordion-title:before {
            content: '\2191 ';
        }
    .accordion-item .accordion-content {
        margin-bottom: 32px;
        display: none;
        padding: 8px;
    }


/*
 * 



h6.timeline-title {
    font-size: 16px;
}
.timeline-table { border-collapse: separate; border-spacing: 8px;  }
.timeline-week { background: #888888; width: 12px; height: 6px; margin: 2px; display: inline-block;}
.timeline-week.inactive { background: #888888; }
.timeline-week.active { background: #000099; }
.timeline-week.future { background: #0000ff; }
.timeline-week.paused { background: #FF6600; }
.timeline-week.current { background: #0099FF; }
 */



/* ==================
   Initializr Theme
   ================== */
@import "ui.base.css";
@import "ui.theme.css";


/* =============================================================================
   Non-semantic helper classes
   Please define your styles before this section.
   ========================================================================== */

/* For image replacement */
.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
.ir br { display: none; }

/* Hide for both screenreaders and browsers:
   css-discuss.incutio.com/wiki/Screenreader_Visibility */
.hidden { display: none; visibility: hidden; }
.show { display: block; visibility: visible; }

/* Hide only visually, but have it available for screenreaders: by Jon Neal.
  www.webaim.org/techniques/css/invisiblecontent/  &  j.mp/visuallyhidden */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: drupal.org/node/897638 */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/* Contain floats: nicolasgallagher.com/micro-group-hack/ */ 
.group:before, .group:after { content: ""; display: table; }
.group:after { clear: both; }
.group { zoom: 1; }



/* =============================================================================
   PLACEHOLDER Media Queries for Responsive Design.
   These override the primary ('mobile first') styles
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 480px) {
  /* Style adjustments for viewports 480px and over go here */

}

@media only screen and (min-width: 768px) {
  /* Style adjustments for viewports 768px and over go here */

}


/* =============================================================================
   Print styles.
   Inlined to avoid required HTTP connection: www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */
 
@media print {
  * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: sanbeiji.com/archives/953 */
  a, a:visited { color: #444 !important; text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3{ page-break-after: avoid; }
}
